
<form id="form_bon_commande_fournisseur" method="post" {{ form_enctype(form) }}>
    <div class="span12">
        <div class="box gradient">
            <div class="title">
                <h4>
                    <span>Information</span>
                </h4>
            </div>

            <div class="content noPad clearfix">
                <table style="width: 100%">
                    <tr>
                        <td style="width: 20%">
                            <label>Date:</label>
                            <div>
                                    {{ form_widget(form.date)}}{{ form_widget(form._token)}}
                                    <input id="now" type="text" style="width: 70px;" readonly/>
                                    <img src="/images/start.jpg" height="30" width="30" style="display: none;" id="start"> 
                                    <img src="/images/previous.jpg" height="30" width="30" style="display: none;" id="prev"> 
                                </div>
                            </td>
                            <td  style="width: 20%">
                                <label>Fournisseur:</label>
                                <div  style="width: 200px">
                                    {{ form_widget(form.fournisseur,{'attr':{'class':'nostyle','style':'width:100%'}})}}
                                    </div> 
                                </td>
                                <td  style="width: 20%">
                                    <label>Departement:</label>
                                    <div style="width: 200px">
                                    {{ render(controller('GdsVenteBundle:Devis:getAllDepartement')) }}
                                        </div> 
                                    </td>
                                    <td  style="width: 40%">
                                        <label>Numero Bon Commande:</label>
                                {{ form_widget(form.reference,{'attr':{'class':'span8 text','readonly':'readonly','style':'width:200px'}})}}
                                    </td>
                                </tr>
                            </table>
                        </div> 
                    </div>
                </div>
            </form>

            <div class="span12" style="margin-left:0">
                <table>
                    <tr>
                        <td id="td_familles">
                            <input type="text" id="familles" style="width:100%"/>
                        </td>
                        <td id="td_sous_familles">
                            <input type="text" id="sous_familles" style="width:100%"/>
                        </td>
                        <td id="td_articles">
                            <input type="text" id="articles" style="width:100%"/>
                        </td>
                    </tr>
                </table>
                <div class="box gradient">
                    <div class="content noPad clearfix">
                        <table id="table_bon_commande" cellpadding="0" cellspacing="0" border="0" class="responsive  display table table-bordered" width="100%">
                            <thead>
                                <tr >
                                    <th style="width:5%">N°</th>
                                    <th style="width:25%" >Reference</th>
                                    <th style="width:40%" >Designation</th>
                                    <th style="width:15%" >Quantite</th>
                                    <th id="th_dispo" style="width:10%">Dispo</th>
                                    <th id="ok"></th>
                                </tr>
                            </thead>
                            <tbody id="gds_achatbundle_ligneboncommande">
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="span2" style="margin-right: 0">
                <table>
                    <tr>
                        <td style="text-align: center">
                            <input type="button" style="width:100px" id="submit_form_bon_commande_fournisseur" value="Enregistrer" class="nostyle btn btn-success btn-large" />
                        </td>
                        <td style="text-align: center">
                            <input type="button" style="width:100px" id="submit_form_bon_commande_fournisseur_print" value="Imprimer" onclick="EnregistrerImprimer()" class="nostyle btn btn-success btn-large" />
                        </td>
                    </tr>
                    <tr>
                        <td style="height: 20px"></td>
                    </tr>
                    <tr>
                        <td>
                            <input id="retour2" style="width:100px" type="button" class="btn btn-info cut-icon-previous"  value="Retour" onclick="retourListeDevis2()">
                        </td>
                    </tr>
                </table>
            </div>
            <script>
                                $(document).ready(function() {
                                    key_success = ''
                                    key = '';
                                    $('#gds_achatbundle_boncommandefournisseurtype_reference').keypress(function(event) {
                                        key = key + String.fromCharCode(event.charCode);
                                        if (event.charCode == 0) {
                                            keyEnterPressed()
                                        }
                                    });
                                    $('#now').keypress(function(event) {
                                        key = key + String.fromCharCode(event.charCode);
                                        if (event.charCode == 0) {
                                            keyEnterPressed2()
                                        }
                                    });
                                    $('#departement').change(function() {
                                        if (key_success != '') {
                                            key = key_success
                                            keyEnterPressed()
                                        } else {
                                            setTousQuantite();
                                        }

                                    })
                                    $.ajax({
                                        url: '{{path('gds_vente_get_all_articles_bon_commande')}}',
                                        datatype: 'json',
                                        success: function(data) {
                                            $("#articles").tokenInput(data, {
                                                preventDuplicates: true,
                                                onAdd: function(item) {
                                                    $('.token-input-token').hide()
                                                    var article = getArticle(item.id)
                                                    if (!article) {
                                                        add_ligne()
                                                        var article = item.name.split(' : ');
                                                        var reference = article[0]
                                                        var designation = article[1]
                                                        articles.push(item)
                                                        var id = index - 1
                                                        $('#td_reference_' + id).html(reference)
                                                        $('#td_designation_' + id).html(designation)
                                                        $('#gds_achatbundle_' + id + '_article').val(item.id)
                                                        setQuantite(id)
                                                    } else {
                                                        id = article.index
                                                    }
                                                    $('#gds_achatbundle_' + id + '_quantite').focus()
                                                },
                                            });
                                        }
                                    })
                                    familles = []
                                    sous_familles = []
                                    $.ajax({
                                        url: '{{path('gds_vente_get_all_familles')}}',
                                        datatype: 'json',
                                        success: function(data) {
                                            $('#familles').tokenInput(data, {
                                                preventDuplicates: true,
                                                onAdd: function(item) {
                                                    familles[familles.length] = item.id
                                                    chercherSousFamilles()
                                                    chercherArticles('famille')
                                                },
                                                onDelete: function(item) {
                                                    familles.splice($.inArray(item.id, familles), 1);
                                                    chercherSousFamilles()
                                                    chercherArticles('famille')
                                                },
                                            });
                                        }
                                    })
                                    $('#sous_familles').tokenInput('', {
                                        preventDuplicates: true
                                    });
                                })
                                function add_ligne() {
                                    // On d�finit le num�ro du champ (en comptant le nombre de champs d�j� ajout�s)
                                    //index = $container.children().length;
                                    var td_num = '<td class="numero_ligne" style="padding:0;text-align:center" id="td_num_' + index + '">' + nb_article + '</td>';
                                    var hidden_stock = '<input id="gds_achatbundle_' + index + '_article" type="hidden"/>';
                                    var td_reference = '<td style="padding:0;" id="td_reference_' + index + '"></td>';
                                    var td_designation = '<td style="padding:0;" id="td_designation_' + index + '"></td>';
                                    var td_qte = '<td style="padding:0;" id="td_qte_' + index + '"><input  class="quantite" style="padding:2%;width:60%" type="text" id="gds_achatbundle_' + index + '_quantite" type="text" value="1" onkeyup="Test(this)"></td>';
                                    var td_qte_dispo = '<td style="padding:0;" id="td_qte_dispo_' + index + '"></td>';
                                    var td_delete = '<td ><img src="/images/icons/delete.png" id="delete_ligne_' + index + '" onclick="delete_ligne(' + index + ')"></td>'
                                    var tr_contenu = td_num + td_reference + td_designation + hidden_stock + td_qte + td_qte_dispo + td_delete;
                                    var tr = $('<tr id="tr_' + index + '">' + tr_contenu + '</tr>')
                                    $container.append(tr);
                                    index++
                                    nb_article++
                                    b = tr.attr('id')
                                    b = b.split('_')
                                    b = b[1]

                                    $('#gds_achatbundle_' + b + '_quantite').spinner({
                                        min: 0,
                                        max: 10000,
                                        step: 1,
                                        places: 2,
                                        showOn: 'both'
                                    });
                                    $('#gds_achatbundle_' + b + '_quantite').keyup(function() {
                                        var i = $(this).attr('id');
                                        i = i.split('_');
                                        i = i[2];
                                        quantite = $(this).val();
                                        var article = getArticle($('#gds_achatbundle_' + i + '_article').val())
                                        article.quantite = quantite
                                    });
                                    $('#gds_achatbundle_' + b + '_quantite').change(function() {
                                        var i = $(this).attr('id');
                                        i = i.split('_');
                                        i = i[2];
                                        quantite = $(this).val();
                                        var article = getArticle($('#gds_achatbundle_' + i + '_article').val())
                                        article.quantite = quantite
                                    });
                                    $('#gds_achatbundle_' + b + '_quantite').blur(function() {
                                        if (!$('.msgBoxTitle').html())
                                            $('#articles').focus()
                                    })

                                    refraichir()
                                }
                                function Test(obj) {
                                    var data = obj.value;
                                    var d = data.substring(0, data.length - 1)
                                    var index_virgule = data.indexOf('.')
                                    if (index_virgule > 0)
                                        apres_virgule = data.substring(data.indexOf('.') + 1, data.length)
                                    if (!TestVerif(data) || apres_virgule.length > 3)
                                        obj.value = d
                                }
                                function TestVerif(decimal) {
                                    var entier = "0123456789"
                                    var virgule = false
                                    var first_number = false
                                    for (index_verif = 0; index_verif < decimal.length; index_verif++) {
                                        if (entier.indexOf(decimal[index_verif]) < 0) {
                                            if (decimal[index_verif] == '.' && first_number) {
                                                if (virgule)
                                                    return false
                                                else
                                                    virgule = true
                                            } else {
                                                return false
                                            }
                                        } else {
                                            first_number = true
                                        }
                                    }
                                    return true
                                }
                                function chercherSousFamilles() {
                                    $('#td_sous_familles ul').remove()
                                    $.ajax({
                                        url: '{{path('gds_vente_get_sous_familles_where_familles')}}',
                                        datatype: 'json',
                                        data: 'familles={"familles":' + JSON.stringify(familles) + '}',
                                        success: function(data) {
                                            $('#sous_familles').tokenInput(data, {
                                                preventDuplicates: true,
                                                onAdd: function(item) {
                                                    sous_familles[sous_familles.length] = item.id
                                                    chercherArticles('sous')
                                                },
                                                onDelete: function(item) {
                                                    sous_familles.splice($.inArray(item.id, sous_familles), 1);
                                                    chercherArticles('sous')
                                                },
                                            });
                                        }
                                    })
                                }
                                function chercherArticles(from) {
                                    if (from == 'famille')
                                        sous_familles = []
                                    $('#td_articles ul').remove()
                                    $.ajax({
                                        url: '{{path('gds_vente_get_articles_bon_commande_where_familles')}}',
                                        data: 'familles={"familles":' + JSON.stringify(familles) + ',"sous_familles":' + JSON.stringify(sous_familles) + '}',
                                        datatype: 'json',
                                        success: function(data) {
                                            $("#articles").tokenInput(data, {
                                                preventDuplicates: true,
                                                onAdd: function(item) {
                                                    $('#td_articles').children('.token-input-list').children('.token-input-token').hide()
                                                    var article = getArticle(item.id)
                                                    if (!article) {
                                                        add_ligne()
                                                        var article = item.name.split(' : ');
                                                        var reference = article[0]
                                                        var designation = article[1]
                                                        articles.push(item)
                                                        var id = index - 1
                                                        $('#td_reference_' + id).html(reference)
                                                        $('#td_designation_' + id).html(designation)
                                                        $('#gds_ventebundle_' + id + '_article').val(item.id)
                                                        setQuantite(id)
                                                    } else {
                                                        id = article.index
                                                    }
                                                    $('#gds_achatbundle_' + id + '_quantite').focus()
                                                },
                                            });
                                        }
                                    })
                                }
                                function delete_ligne(index) {
                                    var article = getArticle($('#gds_achatbundle_' + index + '_article').val())
                                    var cmp_delete = 0
                                    var article_deleted = false
                                    while (!article_deleted && cmp_delete < articles.length) {
                                        if (articles[cmp_delete] == article) {
                                            articles.splice(cmp_delete, 1)
                                            article_deleted = true
                                        }
                                        cmp_delete++
                                    }
                                    $('#tr_' + index).remove();
                                    $('.token-input-list li').each(function() {
                                        var name = article.reference + ' : ' + article.designation
                                        if ($(this).children("p").html() == name)
                                            $(this).remove()
                                    })
                                    refraichir()
                                }
                                function refraichir() {
                                    i = 1
                                    $('.numero_ligne').each(function() {
                                        $(this).html(i)
                                        i++
                                    })
                                }
                                function getArticle(id) {
                                    for (i = 0; i < articles.length; i++) {
                                        if (articles[i].id == id) {
                                            return articles[i]
                                        }
                                    }
                                    return null
                                }

                                function setQuantite(id) {
                                    $.ajax({
                                        url: "{{ path('gds_devis_qte_disponible') }}",
                                        data: 'reference=' + $('#td_reference_' + id).html() + '&departement=' + $('#departement option:selected').text(),
                                        success: function(data) {
                                            if (data == 'failed')
                                                $('#td_qte_dispo_' + id).html('')
                                            else {
                                                var qte_all = data['qte_all'] + data['qte_all_2']
                                                if ($('#departement option:selected').val() == 0) {
                                                    $('#td_qte_dispo_' + id).html(qte_all)
                                                } else {
                                                    var qte_dep = data['qte'] + data['qte_2']
                                                    $('#td_qte_dispo_' + id).html("<span class='green'><b>" + qte_dep + "</b></span><span class='red'><b>|</b></span>" + qte_all)
                                                }
                                            }
                                        }
                                    })
                                }
                                function time() {
                                    var time = new Date($.now())
                                    h = time.getHours() // 0-24 format
                                    m = time.getMinutes()
                                    s = time.getSeconds()
                                    $('#heure').val(s + m * 60 + h * 3600)
                                    if (h < 10)
                                        h = '0' + h
                                    if (m < 10)
                                        m = '0' + m
                                    if (s < 10)
                                        s = '0' + s
                                    $('#now').val(h + ':' + m + ':' + s)
                                }


                                function EnregistrerImprimer() {
                                    imprimer()
                                    Enregistrer()
                                }
                                function imprimer() {
                                    alert('impression')
                                    var lignes = remplirLignes()
                                    var taxes = remplirTaxes()
                                    var others = remplirOthers()
                                    $.ajax({
                                        url: '{{path('gds_devis_print')}}',
                                        type: "POST",
                                        datatype: 'json',
                                        data: 'contenu={ "lignes":' + JSON.stringify(lignes) + ',"taxes":' + JSON.stringify(taxes) + ',"others":' + JSON.stringify(others) + '}',
                                        success: function(data) {
                                        }
                                    })
                                }
                                function keyEnterPressed() {
                                    var lignes = remplirLignes()
                                    key_success = key
                                    key = key.substr(0, key.length - 1);
                                    $.ajax({
                                        url: '{{path('gds_devis_qte_disponible_noir')}}',
                                        type: "POST",
                                        datatype: 'json',
                                        data: 'contenu={"lignes":' + JSON.stringify(lignes) + '}&key=' + key + '&departement=' + $("#departement option:selected").text(),
                                        success: function(data) {
                                            if (data != 'failed') {
                                                for (i_qte = 0; i_qte < data.length; i_qte++) {
                                                    var index = lignes[i_qte].index
                                                    var qte_all = data[i_qte]['qte_all']
                                                    var qte_all_2 = data[i_qte]['qte_all_2']
                                                    if ($('#departement option:selected').val() == 0) {
                                                        $('#td_qte_dispo_' + index).html("<span class='green'>" + qte_all + "</span>" + "*" + qte_all_2 + "</span>")
                                                    } else {
                                                        var qte_dep = data[i_qte]['qte']
                                                        var qte_dep_2 = data[i_qte]['qte_2']
                                                        $('#td_qte_dispo_' + index).html("<b><span class='green'>" + qte_dep + "</span>" + "*" + qte_dep_2 + "</span>" + "</b><span class='red'><b>|</b></span>" + "<span class='green'>" + qte_all + "</span>" + "*" + qte_all_2 + "</span>")
                                                    }
                                                }
                                            } else {
                                                key_success = ''
                                                setTousQuantite()
                                            }
                                        }
                                    })
                                    key = ''
                                }

                                function remplirLignes() {
                                    var cmp = 0
                                    var lignes = new Array()
                                    $('#gds_achatbundle_ligneboncommande tr').each(function() {
                                        var i = $(this).attr('id');
                                        i = i.split('_');
                                        i = i[1]
                                        var article = getArticle($('#gds_achatbundle_' + i + '_article').val())
                                        lignes[cmp] = article
                                        lignes[cmp].index = i
                                        cmp++
                                    })
                                    return lignes
                                }


                                function setTousQuantite() {
                                    $('#gds_achatbundle_ligneboncommande tr').each(function() {
                                        var ii = $(this).attr('id');
                                        ii = ii.split('_');
                                        ii = ii[1]
                                        setQuantite(ii)
                                    })
                                }
                </script>
                <style>
                        .red {
                            color: red;
                            font-size: 18px;
                        }
                        .green{
                            color : green;
                        }
                    </style>